<template>
  <basic-container>
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      ref="crud"
      :page.sync="page"
      :search.sync="search"
      v-model="form"
      @row-del="rowDel"
      @row-update="rowUpdate"
      @row-save="rowSave"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
    >
      <template slot="menuRight">
        <user-table-config :option="option" @confirm="(val) => handleSetUserConfig(val)"></user-table-config>
      </template>
      <template #metricNameSearch="{}">
        <el-cascader :options="cascadeData" v-model="search.metricId"></el-cascader>
      </template>
      <template slot="menuLeft">
        <el-button type="primary" size="small" icon="el-icon-plus" v-if="permission.messageStrategy_add" @click="handleAdd">新 增</el-button>
        <el-button type="danger" size="small" icon="el-icon-delete" v-if="permission.messageStrategy_delete" @click="handleDelete">删 除 </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
        <!-- <el-button v-if="scope.row.status == 0 && permission.messageStrategy_enbale" type="text" size="small" icon="el-icon-circle-check" @click="handleEnbale(scope.row)"
          >启用</el-button
        >
        <el-button v-if="scope.row.status == 1 && permission.messageStrategy_disable" type="text" size="small" icon="el-icon-circle-close" @click="handleDisable(scope.row)"
          >禁用</el-button
        > -->
        <el-button icon="el-icon-view" size="small" type="text" @click="opendetailRow(scope.row, 'view')">详情</el-button>
        <el-button icon="el-icon-edit" size="small" type="text" v-if="permission.messageStrategy_edit" @click.stop="opendetailRow(scope.row, 'edit')">编辑</el-button>
        <el-button icon="el-icon-delete" size="small" type="text" v-if="permission.messageStrategy_delete" @click.stop="detailRowDel(scope.row, scope.index, done)"
          >删除
        </el-button>
      </template>
      <template slot-scope="{ row }" slot="source">
        <div style="text-align: center">
          <i :class="row.source" />
        </div>
      </template>
      <template slot-scope="{ row }" slot="clientType">
        <el-tag>{{ row.clientType }}</el-tag>
      </template>
    </avue-crud>
    <el-dialog class="messageStrategyShowDialog" ref="dialog" :title="dialogTitle" append-to-body :visible.sync="showDialog" top="5vh" @close="closeDialog">
      <div class="sail-header-dialog-content">
        <el-tabs type="border-card" v-model="tabsIndex">
          <el-tab-pane label="预警内容" name="1">
            <avue-form v-if="showDialog" ref="form1" v-model="form" :option="basicDataOption">
              <template #triggerRule="{}">
                <div v-if="dialogTitle != '详情'" class="detailForm">
                  <el-row :gutter="20" v-for="(item, index) in triggerRuleList" :key="index">
                    <el-col :span="6">
                      <span style="padding: 0 5px; color: red">*</span>
                      <el-select v-model="item.operator" placeholder="请选择 对比方式" :disabled="dialogTitle === '详情'">
                        <el-option v-for="(item, index) in ruleContrastMethodList" :label="item.dictValue" :value="item.dictKey" :key="index"></el-option>
                      </el-select>
                    </el-col>
                    <el-col :span="6">
                      <span style="padding: 0 5px; color: red">*</span>
                      <el-input-number
                        placeholder="请输入 阈值"
                        v-model="item.maxValue"
                        :precision="1"
                        min="0"
                        controls-position="right"
                        :disabled="dialogTitle === '详情'"
                        style="width: 100%"
                      ></el-input-number>
                    </el-col>
                    <el-col :span="7" v-if="item.operator === 'LESSTHANORQEUAL'">
                      <el-tooltip v-if="item.operator && item.maxValue" class="item" effect="dark" :content="'当指标≤' + item.maxValue + '时，则发送预警'" placement="top">
                        <span><i class="el-icon-info"></i></span>
                      </el-tooltip>
                    </el-col>
                    <el-col :span="7" v-if="item.operator === 'EQUALS'">
                      <el-tooltip v-if="item.operator && item.maxValue" class="item" effect="dark" :content="'当指标=' + item.maxValue + '时，则发送预警'" placement="top">
                        <span><i class="el-icon-info"></i></span>
                      </el-tooltip>
                    </el-col>
                    <el-col :span="7" v-if="item.operator === 'GREATERTHANOREQUAL'">
                      <el-tooltip v-if="item.operator && item.maxValue" class="item" effect="dark" :content="'当指标≥' + item.maxValue + '时，则发送预警'" placement="top">
                        <span><i class="el-icon-info"></i></span>
                      </el-tooltip>
                    </el-col>
                    <el-col :span="5" style="display: flex; justify-content: space-between; align-items: center">
                      <div v-if="indicatorUnit">单位：{{ indicatorUnit }}</div>
                      <div v-if="dialogTitle != '详情'">
                        <el-button
                          style="margin-left: 10px; font-size: 18px; color: red"
                          icon="el-icon-delete"
                          size="small"
                          type="text"
                          @click="delTriggerRule(index)"
                        ></el-button>
                        <el-button
                          v-if="index == 0"
                          style="font-size: 18px"
                          icon="el-icon-circle-plus-outline"
                          size="small"
                          type="text"
                          :disabled="triggerRuleList.length === 10"
                          @click="addTriggerRule"
                        ></el-button>
                      </div>
                    </el-col>
                  </el-row>
                </div>
                <div v-if="dialogTitle === '详情'">
                  <avue-crud :option="detailRuleOption" :data="detailRuleData"></avue-crud>
                </div>
              </template>
            </avue-form>
          </el-tab-pane>
          <el-tab-pane label="通知设置" name="2">
            <avue-form v-if="showDialog" ref="form2" v-model="form" :option="settingInfoOption">
              <template #notifyObjectListLabel="{}">
                <span style="padding: 0 5px; color: red" v-if="form.notifyType != 'MACHINE' || form.isEmailNotification">*</span>
                <span>通知对象</span>
              </template>
              <template #notifyObjectList>
                <div style="display: flex">
                  <div class="tags">
                    <el-tag v-for="tag in notifyObjectTags" :key="tag.id" closable size="small" @close="tagClose(tag)">{{ tag.label }}</el-tag>
                  </div>
                  <el-dropdown v-if="dialogTitle != '详情'" trigger="click" :hide-on-click="false" @command="handleCommand" style="margin-left: 5px; height: 30px">
                    <span class="el-dropdown-link">
                      <el-button icon="el-icon-circle-plus-outline" size="small" type="text">添加对象</el-button>
                    </span>
                    <el-dropdown-menu slot="dropdown" :append-to-body="false">
                      <el-dropdown-item command="role">
                        <el-popover placement="right" width="150" v-model="visibleRole" :append-to-body="false">
                          <div slot="reference">角色</div>
                          <el-checkbox-group style="height: 350px; overflow-x: hidden" v-model="selectRole" @change="selectRoleChange">
                            <el-checkbox v-for="(item, index) in roleList" :key="index" :label="JSON.stringify(item)">{{ item.roleName }}</el-checkbox>
                          </el-checkbox-group>
                        </el-popover>
                      </el-dropdown-item>
                      <el-dropdown-item command="dept">
                        <el-popover placement="right" width="300" v-model="visibleDept" :append-to-body="false">
                          <div slot="reference">部门/人员</div>
                          <div style="height: 350px; overflow-x: hidden">
                            <el-tree
                              ref="elTree"
                              lazy
                              :load="loadNode"
                              :props="props"
                              node-key="id"
                              show-checkbox
                              :default-expanded-keys="defaultExpandedKey"
                              :default-checked-keys="defaultChecked"
                              @check="currentCheck"
                            />
                          </div>
                        </el-popover>
                      </el-dropdown-item>
                    </el-dropdown-menu>
                  </el-dropdown>
                </div>
              </template>
              <template #upgradeNotifyObjectListLabel="{}">
                <span style="padding: 0 5px; color: red" v-if="form.notifyType != 'MACHINE' || form.isEmailNotification || form.levelType == 2">*</span>
                <span>升级通知对象</span>
              </template>
              <template #upgradeNotifyObjectList>
                <div style="display: flex">
                  <div class="tags">
                    <el-tag v-for="tag in notifyObjectTags2" :key="tag.id" closable size="small" @close="tagClose2(tag)">{{ tag.label }}</el-tag>
                  </div>
                  <el-dropdown v-if="dialogTitle != '详情'" trigger="click" :hide-on-click="false" @command="handleCommand2" style="margin-left: 5px; height: 30px">
                    <span class="el-dropdown-link">
                      <el-button icon="el-icon-circle-plus-outline" size="small" type="text">添加对象</el-button>
                    </span>
                    <el-dropdown-menu slot="dropdown" :append-to-body="false">
                      <el-dropdown-item command="role">
                        <el-popover placement="right" width="150" v-model="visibleRole2" :append-to-body="false">
                          <div slot="reference">角色</div>
                          <el-checkbox-group style="height: 350px; overflow-x: hidden" v-model="selectRole2" @change="selectRoleChange2">
                            <el-checkbox v-for="(item, index) in roleList" :key="index" :label="JSON.stringify(item)">{{ item.roleName }}</el-checkbox>
                          </el-checkbox-group>
                        </el-popover>
                      </el-dropdown-item>
                      <el-dropdown-item command="dept">
                        <el-popover placement="right" width="300" v-model="visibleDept2" :append-to-body="false">
                          <div slot="reference">部门/人员</div>
                          <div style="height: 350px; overflow-x: hidden">
                            <el-tree
                              ref="elTree2"
                              lazy
                              :load="loadNode"
                              :props="props"
                              node-key="id"
                              show-checkbox
                              :default-expanded-keys="defaultExpandedKey2"
                              :default-checked-keys="defaultChecked2"
                              @check="currentCheck2"
                            />
                          </div>
                        </el-popover>
                      </el-dropdown-item>
                    </el-dropdown-menu>
                  </el-dropdown>
                </div>
              </template>
              <template #notificationContent="{}">
                <div>
                  <el-button icon="el-icon-circle-plus-outline" size="small" type="text" @click="addTriggerRule">插入参数</el-button>
                  <span><i class="el-icon-info"></i></span>
                  <el-input
                    type="textarea"
                    :rows="5"
                    placeholder="请输入 通知内容"
                    maxlength="500"
                    show-word-limit
                    v-model="form.notificationContent"
                    :disabled="dialogTitle === '详情'"
                  ></el-input>
                </div>
              </template>
              <template #isEmailNotification="{}">
                <el-checkbox v-model="form.isEmailNotification" :disabled="dialogTitle === '详情'">邮件通知</el-checkbox>
                <el-tooltip class="item" effect="dark" content="若勾选，则同时发送邮件到对应人员邮箱中" placement="top">
                  <span><i class="el-icon-info"></i></span>
                </el-tooltip>
              </template>
              <template #notifyContentLabel="{}">
                <span style="padding: 0 5px; color: red" v-if="form.isEmailNotification">*</span>
                <span>通知内容</span>
              </template>
              <template #notifyContent="{}">
                <div>
                  <!-- <el-button icon="el-icon-circle-plus-outline" size="small" type="text" @click="addTriggerRule">插入参数</el-button> -->
                  <!-- <span><i class="el-icon-info"></i></span> -->
                  <el-input
                    type="textarea"
                    :rows="5"
                    placeholder="请输入 邮件内容"
                    maxlength="500"
                    show-word-limit
                    v-model="form.notifyContent"
                    :disabled="dialogTitle === '详情'"
                  ></el-input>
                </div>
              </template>
            </avue-form>
          </el-tab-pane>
        </el-tabs>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button v-if="dialogTitle === '新增' || dialogTitle === '新增子项'" size="small" type="primary" @click="submit">
          <i class="el-icon-circle-plus-outline"></i><span>保 存</span></el-button
        >
        <el-button v-if="dialogTitle === '编辑'" size="small" type="primary" @click="submit"> <i class="el-icon-circle-check"></i><span>修 改</span></el-button>
        <el-button size="small" @click="showDialog = false"><i class="el-icon-circle-close"></i><span>取 消</span></el-button>
      </span>
    </el-dialog>
    <common-modal-template ref="commonModalTemplate" :option="tableOption" @getSelectedRows="getSelectedRows" :key="timer" @newKey="newKey"></common-modal-template>
  </basic-container>
</template>

<script>
import {
  getList,
  getAltStrategyType,
  getModule,
  getMetricByModule,
  getAltRuleContrastMethod,
  getRoleList,
  submit,
  getDetail,
  remove,
  enable,
  disable,
  getTree,
  getTreeChild
} from '@/api/earlyWarning/messageStrategy';
import { getParamDetail } from '@/api/system/param';
import { mapGetters } from 'vuex';
import CommonModalTemplate from '@/components/common-modal-template/common-modal-template.vue';
import userTableConfig from '@/components/user-table-config';
import userConfig from '@/mixins/userConfig';

export default {
  name: 'earlyWarningMessageStrategy',
  components: {
    CommonModalTemplate,
    userTableConfig
  },
  mixins: [userConfig()],
  data() {
    return {
      form: {},
      query: {},
      loading: true,
      selectionList: [],
      page: {
        pageSize: 15,
        currentPage: 1,
        total: 0
      },
      option: {
        height: 'calc(100vh - 438px)',
        calcHeight: 30,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
        dialogWidth: '60%',
        border: true,
        index: true,
        indexLabel: '序号',
        selection: true,
        addBtn: false,
        editBtn: false,
        delBtn: false,
        viewBtn: false,
        viewBtnText: '详情',
        viewText: '详情',
        menuWidth: 300,
        dialogClickModal: false,
        searchLabelWidth: 150,
        column: [
          {
            label: '预警方案名称',
            prop: 'strategyName',
            search: true
          },
          {
            label: '预警方案编码',
            prop: 'strategyCode'
          },
          {
            label: '类型',
            prop: 'strategyType',
            type: 'select',
            dicData: []
          },
          {
            label: '预警指标名称',
            prop: 'metricName'
          },
          {
            label: '业务模块',
            prop: 'module',
            type: 'select',
            dicUrl: '/api/blade-system/dict/dictionary?code=alt_metric_module',
            props: {
              label: 'dictValue',
              value: 'dictKey'
            }
          },
          {
            label: '更新人',
            prop: 'creator'
          },
          {
            label: '更新时间',
            prop: 'createTime'
          },
          {
            label: '状态',
            prop: 'status',
            html: true,
            formatter: (val) => {
              if (val.status == 0) {
                return '<b style="color:red">禁用</b>';
              } else {
                return '<b style="color:#70b603">启用</b>';
              }
            }
          }
        ]
      },
      data: [],
      dialogTitle: '新增',
      tabsIndex: '1',
      basicDataOption: {
        submitBtn: false,
        emptyBtn: false,
        labelWidth: 150,
        detail: false,
        group: [
          {
            label: '基本信息',
            prop: 'partInfo',
            arrow: false,
            icon: 'el-icon-vertical-bar',
            display: true,
            column: [
              {
                label: '预警方案名称',
                prop: 'strategyName',
                span: 24,
                rules: [
                  {
                    required: true,
                    message: '请输入预警方案名称',
                    trigger: 'blur'
                  }
                ],
                blur: (val) => {
                  this.form.strategyName = val.value.replace(/\s/g, '');
                }
              },
              {
                label: '预警指标编码',
                prop: 'strategyCode',
                disabled: true
              },
              {
                label: '状态',
                prop: 'status',
                type: 'select',
                dicData: [
                  { label: '启用', value: 1 },
                  { label: '禁用', value: 0 }
                ],
                value: 1,
                rules: [
                  {
                    required: true,
                    message: '请选择状态',
                    trigger: 'blur'
                  }
                ]
              },
              {
                label: '类型',
                prop: 'strategyType',
                type: 'select',
                dicData: [],
                rules: [
                  {
                    required: true,
                    message: '请选择类型',
                    trigger: 'blur'
                  }
                ]
                // change: (val) => {
                //   if (val) {
                //     let silence = this.findObject(this.basicDataOption.group[0].column, 'silence');
                //     let levelType = this.findObject(this.basicDataOption.group[0].column, 'levelType');
                //     let strategyName = this.findObject(this.basicDataOption.group[0].column, 'strategyName');
                //     let metricId = this.findObject(this.basicDataOption.group[0].column, 'metricId');
                //     if (val.value === 'METRIC' || !val.value) {
                //       this.basicDataOption.group[1].display = true;
                //       silence.display = true;
                //       levelType.display = true;
                //       strategyName.label = '预警名称';
                //       metricId.label = '预警指标';
                //       metricId.labelTip = '选择触发预警通知的指标，该指标由系统维护';
                //       metricId.rules[0].message = '请选择预警指标';
                //       if (val.value != this.strategyType) {
                //         this.strategyType = '';
                //         this.form.metricId = '';
                //       }
                //     } else if (val.value === 'REMIND') {
                //       this.basicDataOption.group[1].display = false;
                //       this.triggerRuleList = [{ operator: 'LESSTHAN', maxValue: undefined }];
                //       silence.display = false;
                //       levelType.display = false;
                //       this.form.silence = '';
                //       this.form.levelType = '1';
                //       strategyName.label = '消息名称';
                //       metricId.label = '消息通知';
                //       metricId.labelTip = '选择触发消息提醒的事件';
                //       metricId.rules[0].message = '请选择消息通知';
                //       if (val.value != this.strategyType) {
                //         this.strategyType = '';
                //         this.form.metricId = '';
                //       }
                //       this.form.rules = [];
                //     } else if (val.value === 'EVENT') {
                //       this.basicDataOption.group[1].display = false;
                //       this.triggerRuleList = [{ operator: 'LESSTHAN', maxValue: undefined }];
                //       silence.display = true;
                //       levelType.display = true;
                //       strategyName.label = '预警名称';
                //       metricId.label = '预警事件';
                //       metricId.labelTip = '选择触发预警通知的业务事件';
                //       metricId.rules[0].message = '请选择预警事件';
                //       if (val.value != this.strategyType) {
                //         this.strategyType = '';
                //         this.form.metricId = '';
                //       }
                //       this.form.rules = [];
                //     }
                //     //获取预警策略指标字典
                //     getModule(val.value).then(
                //       (res) => {
                //         let data = this._get(res, 'data.data', []);
                //         this.metricList = this._cloneDeep(data);
                //         this.cascadeData = this._map(data, (item) => {
                //           item.children = this._map(item.children, (childrenItem) => {
                //             return {
                //               label: childrenItem.value,
                //               value: childrenItem.id
                //             };
                //           });
                //           return {
                //             label: item.value,
                //             value: item.key,
                //             children: item.children
                //           };
                //         });
                //       },
                //       (error) => {
                //         this.cascadeData = [];
                //       }
                //     );
                //   }
                // }
              },
              {
                label: '业务模块',
                prop: 'module',
                type: 'select',
                dicUrl: '/api/blade-system/dict/dictionary?code=alt_metric_module',
                props: {
                  label: 'dictValue',
                  value: 'dictKey'
                },
                rules: [
                  {
                    required: true,
                    message: '请选择业务模块',
                    trigger: 'blur'
                  }
                ]
              },
              {
                label: '预警指标',
                prop: 'metricId',
                labelTip: '选择触发预警通知的指标，该指标由系统维护',
                span: 24,
                type: 'select',
                dicData: [],
                rules: [
                  {
                    required: true,
                    message: '请选择预警指标',
                    trigger: 'blur'
                  }
                ]
              }
            ]
          },
          {
            label: '触发规则',
            prop: 'triggerRule',
            arrow: false,
            icon: 'el-icon-vertical-bar',
            display: false,
            column: [
              {
                label: '',
                prop: 'triggerRule',
                span: 24,
                labelWidth: 0
              }
            ]
          }
        ]
      },
      settingInfoOption: {
        submitBtn: false,
        emptyBtn: false,
        labelWidth: 150,
        detail: false,
        group: [
          {
            label: '通知设置',
            prop: 'partInfo',
            arrow: false,
            icon: 'el-icon-vertical-bar',
            display: true,
            column: [
              {
                label: '静默间隔(分)',
                prop: 'silence',
                labelTip: '触发告警并发送第一次通知后，若一直处在告警状态，则间隔多长时间内不再通知',
                type: 'select',
                display: true,
                dicUrl: '/api/blade-system/dict/dictionary?code=ALT_STRATEGY_SILENCE',
                props: {
                  label: 'dictValue',
                  value: 'dictKey'
                }
              },
              {
                label: '预警升级',
                prop: 'levelType',
                labelTip: '若开启，则预警达到X次未处理，第X+1次将预警通知发送至预警升级对象。每X+1次为一个通知新轮回',
                type: 'switch',
                display: true,
                dicData: [
                  { label: '', value: 1 },
                  { label: '', value: 2 }
                ],
                value: '1'
              },
              {
                label: '重复预警次数',
                prop: 'repeatTimes',
                type: 'number',
                labelTip: '当预警次数达到该处设置次数，则将预警通知发送至预警升级对象',
                control: (val, form) => {
                  if (form.levelType == '2') {
                    return {
                      repeatTimes: { display: true }
                    };
                  } else {
                    return {
                      repeatTimes: { display: false }
                    };
                  }
                },
                rules: [
                  {
                    required: true,
                    message: '请输入重复预警次数',
                    trigger: 'blur'
                  }
                ]
              },
              // {
              //   label: '通知方式',
              //   prop: 'notifyType',
              //   type: 'select',
              //   dicData: [
              //     { label: '设备', value: 'MACHINE' }
              //     // { label: '短信', value: 'textMessage' },
              //     // { label: '客户端', value: 'PC' },
              //     // { label: '钉钉', value: 'dingTalk' },
              //     // { label: '企业微信', value: 'weixin' }
              //   ],
              //   span: 24,
              //   control: (val, form) => {
              //     if (form.notifyType == 'MACHINE') {
              //       return {
              //         notifyEquipment: { display: true }
              //       };
              //     } else {
              //       return {
              //         notifyEquipment: { display: false }
              //       };
              //     }
              //   }
              // },
              // {
              //   label: '通知设备',
              //   prop: 'notifyEquipment',
              //   span: 24,
              //   type: 'select',
              //   dicUrl: '/api/mes-qms/ems-equipment/page?categoryCode=NOTICE&equipmentType=MACHINE&current=1&size=200',
              //   props: {
              //     label: 'name',
              //     value: 'id'
              //   },
              //   dicFormatter: (data) => {
              //     this.allEquipmentList = data.data.records;
              //     return data.data.records;
              //   },
              //   multiple: true,
              //   rules: [
              //     {
              //       required: true,
              //       message: '请选择 通知设备',
              //       trigger: 'blur'
              //     }
              //   ]
              // },
              {
                label: '通知对象',
                prop: 'notifyObjectList',
                span: 24
              },
              {
                label: '升级通知对象',
                prop: 'upgradeNotifyObjectList',
                span: 24,
                control: (val, form) => {
                  if (form.levelType == '2') {
                    return {
                      upgradeNotifyObjectList: { display: true }
                    };
                  } else {
                    return {
                      upgradeNotifyObjectList: { display: false }
                    };
                  }
                }
              },
              {
                label: '通知标题',
                prop: 'notifyTitle',
                span: 24,
                rules: [
                  {
                    required: true,
                    message: '请输入 通知标题',
                    trigger: 'blur'
                  }
                ]
              },
              {
                label: '',
                prop: 'isEmailNotification',
                span: 24
              },
              {
                label: '通知内容',
                prop: 'notifyContent',
                span: 24,
                display: true
              }
            ]
          }
        ]
      },
      settingForm: {},
      showDialog: false,
      tableOption: {},
      timer: new Date().getTime(),
      search: {},
      triggerRuleList: [],
      metricList: [],
      cascadeData: [],
      ruleContrastMethodList: [],
      indicatorUnit: '%',
      detailRuleOption: {
        height: '300',
        calcHeight: 30,
        tip: false,
        border: true,
        index: true,
        indexLabel: '序号',
        addBtn: false,
        editBtn: false,
        delBtn: false,
        viewBtn: false,
        menu: false,
        dialogClickModal: false,
        columnBtn: false,
        refreshBtn: false,
        column: [
          {
            label: '对比方式',
            prop: 'operator',
            type: 'select',
            dicData: []
          },
          {
            label: '阈值',
            prop: 'threshold'
          }
        ]
      },
      detailRuleData: [],
      roleList: [],
      selectRole: [],
      notifyObjectTags: [],
      departmentPersonnelList: [],
      props: {
        label: 'label',
        isLeaf: 'leaf',
        children: 'children'
      },
      defaultExpandedKey: [],
      defaultChecked: [],
      halfCheckedKeys: [],
      checkedNodes: [],
      dropdownItem: '',
      visibleRole: false,
      visibleDept: false,
      strategyType: '',
      allEquipmentList: [],
      notifyObjectTags2: [],
      visibleRole2: false,
      visibleDept2: false,
      selectRole2: [],
      defaultExpandedKey2: [],
      defaultChecked2: [],
      halfCheckedKeys2: [],
      checkedNodes2: [],
      metricObj: {}
    };
  },
  computed: {
    ...mapGetters(['userInfo', 'permission']),
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(',');
    }
  },
  watch: {
    'form.module'(val) {
      if (val) {
        let metricId = this.findObject(this.basicDataOption.group[0].column, 'metricId');
        console.log(val);
        getMetricByModule(val).then(
          (res) => {
            let data = this._get(res, 'data.data', []);
            this.metricList = data;
            metricId.dicData = this._map(data, (item) => {
              return {
                label: item.value,
                value: item.id
              };
            });
          },
          (error) => {
            metricId.dicData = [];
          }
        );
      }
    },
    'form.metricId'(val) {
      if (val) {
        this.metricChange(val);
      }
    },
    // 'form.notifyType'(val) {
    //   if (val != 'MACHINE') {
    //     this.form.notifyEquipment = [];
    //   }
    // },
    'form.isEmailNotification'(val) {
      // console.log(val);
      // let notifyContent = this.findObject(this.basicDataOption.group[2].column, 'notifyContent');
      if (val) {
        // notifyContent.display = true;
        getParamDetail({ paramKey: 'alert.notifyTemplate.sms' }).then((res) => {
          let data = res.data.data;
          this.form.notifyContent = data.paramValue;
        });
      } else {
        // notifyContent.display = false;
        this.form.notifyContent = '';
      }
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.$structuralSplit();
    });
    //获取预警策略类型字典
    let optionStrategyType = this.findObject(this.option.column, 'strategyType');
    let dialogStrategyType = this.findObject(this.basicDataOption.group[0].column, 'strategyType');
    getAltStrategyType().then(
      (res) => {
        let data = this._get(res, 'data.data', []);
        let strategyTypeList = this._map(data, (item) => {
          return {
            label: item.dictKey,
            value: item.dictValue
          };
        });
        optionStrategyType.dicData = strategyTypeList;
        dialogStrategyType.dicData = strategyTypeList;
      },
      (error) => {
        optionStrategyType.dicData = [];
        dialogStrategyType.dicData = [];
      }
    );
    //获取对比方式字典
    getAltRuleContrastMethod().then(
      (res) => {
        this.ruleContrastMethodList = this._get(res, 'data.data', []);
        let operator = this.findObject(this.detailRuleOption.column, 'operator');
        operator.dicData = this._map(this.ruleContrastMethodList, (item) => {
          return {
            label: item.dictValue,
            value: item.dictKey
          };
        });
      },
      (error) => {
        this.ruleContrastMethodList = [];
      }
    );
    //获取角色下拉数据
    getRoleList().then((res) => {
      let roleList = this._get(res, 'data.data', []);
      this.roleList = this._map(roleList, (item) => {
        return {
          id: item.id,
          roleName: item.roleName
        };
      });
    });
  },
  methods: {
    addTriggerRule() {
      this.triggerRuleList.push({ operator: '', maxValue: undefined });
    },
    delTriggerRule(index) {
      if (index == 0) {
        this.$set(this.triggerRuleList, [0], { operator: '', maxValue: undefined });
      } else {
        this.triggerRuleList.splice(index, 1);
      }
    },
    metricChange(val) {
      setTimeout(() => {
        let obj = this._find(this.metricList, { id: val });
        if (obj) {
          this.metricObj = obj;
          this.basicDataOption.group[1].display = obj.needRule && obj.needRule == 1 ? true : false;
          if (obj.needRule == 0 || obj.needRule) {
            if (obj.needRule != 1) {
              this.triggerRuleList = [];
            } else if (obj.needRule == 1 && this.triggerRuleList.length == 0) {
              this.triggerRuleList = [{ operator: '', maxValue: undefined }];
            }
          }
          if (obj.valueUnit) {
            this.indicatorUnit = '%';
          } else {
            this.indicatorUnit = '';
          }
        }
      }, 500);
    },
    findNode(list = [], prop) {
      let node;
      list.forEach((ele) => {
        if (ele.prop === prop) node = ele;
      });
      return node;
    },
    handleAdd() {
      this.showDialog = true;
      this.dialogTitle = '新增';
      this.basicDataOption.detail = false;
      // this.basicDataOption.group[0].display = true;
      // this.form.parentId = '';
      // this.form.weightTolerance = 1;
      this.$nextTick(() => {
        this.$refs.form1.allDisabled = false;
        let strategyCode = this.findObject(this.basicDataOption.group[0].column, 'strategyCode');
        strategyCode.disabled = true;
        this.$refs.elTree.setCheckedKeys([]);
        this.defaultExpandedKey = [];
        this.$refs.form2.allDisabled = false;
        this.$refs.elTree2.setCheckedKeys([]);
        this.defaultExpandedKey2 = [];
      });
      this.selectRole = [];
      this.checkedNodes = [];
      this.selectRole2 = [];
      this.checkedNodes2 = [];
    },
    closeDialog() {
      this.$refs.form1.resetFields();
      this.$refs.form2.resetFields();
      this.form = {};
      this.triggerRuleList = [];
      this.notifyObjectTags = [];
      this.notifyObjectTags2 = [];
      this.tabsIndex = '1';
    },
    async submit() {
      var _this = this;
      let validData1 = await new Promise((resolve, reject) => {
        _this.$refs.form1.validate((valid, done) => {
          if (valid) {
            if (this.basicDataOption.group[1].display) {
              let lessthanNum = 0;
              let greaterthanNum = 0;
              let greaterthanOrEqualTo = 0;
              for (let i = 0; i < this.triggerRuleList.length; i++) {
                if (!this.triggerRuleList[i].operator) {
                  this.$message.warning('触发规则中对比方式不能为空！');
                  _this.tabsIndex = '1';
                  done();
                  return;
                }
                if (this.triggerRuleList[i].operator === 'EQUALS') {
                  if (!this.triggerRuleList[i].maxValue) {
                    this.$message.warning('触发规则中对比方式为"="的阈值不能为空！');
                    _this.tabsIndex = '1';
                    done();
                    return;
                  }
                  lessthanNum++;
                }
                if (this.triggerRuleList[i].operator === 'LESSTHANORQEUAL') {
                  if (!this.triggerRuleList[i].maxValue) {
                    this.$message.warning('触发规则中对比方式为"≤"的阈值不能为空！');
                    _this.tabsIndex = '1';
                    done();
                    return;
                  }
                  greaterthanNum++;
                }
                if (this.triggerRuleList[i].operator === 'GREATERTHANOREQUAL') {
                  if (!this.triggerRuleList[i].maxValue) {
                    this.$message.warning('触发规则中对比方式为"≥"的阈值不能为空！');
                    _this.tabsIndex = '1';
                    done();
                    return;
                  }
                  greaterthanOrEqualTo++;
                }
              }
              if (lessthanNum > 1) {
                this.$message.warning('触发规则中对比方式"="的规则不能超过一条！');
                _this.tabsIndex = '1';
                done();
                return;
              }
              if (greaterthanNum > 1) {
                this.$message.warning('触发规则中对比方式为"≤"的规则不能超过一条！');
                _this.tabsIndex = '1';
                done();
                return;
              }
              if (greaterthanOrEqualTo > 1) {
                this.$message.warning('触发规则中对比方式为"≥"的规则不能超过一条！');
                _this.tabsIndex = '1';
                done();
                return;
              }
            }
            resolve();
            done();
          } else {
            _this.tabsIndex = '1';
          }
        });
      });
      let validData2 = await new Promise((resolve, reject) => {
        _this.$refs.form2.validate((valid, done) => {
          if (valid) {
            this.form['rules'] = this.triggerRuleList;
            if ((this.form.notifyType != 'MACHINE' || this.form.isEmailNotification) && this.notifyObjectTags.length === 0) {
              this.$message.warning('通知对象不能为空！');
              _this.tabsIndex = '2';
              done();
              return;
            }
            if ((this.form.notifyType != 'MACHINE' || this.form.isEmailNotification) && this.form.levelType == 2 && this.notifyObjectTags2.length === 0) {
              this.$message.warning('升级通知对象不能为空！');
              _this.tabsIndex = '2';
              done();
              return;
            }
            if ((!this.form.notifyType || this.form.notifyType === null) && !this.form.isEmailNotification) {
              this.$message.warning('通知方式或邮件通知，必选其一！');
              _this.tabsIndex = '2';
              done();
              return;
            }
            if (this.form.isEmailNotification && !this.form.notifyContent) {
              this.$message.warning('通知内容不能为空！');
              _this.tabsIndex = '2';
              done();
              return;
            }
            resolve();
            done();
          } else {
            _this.tabsIndex = '2';
          }
        });
      });
      Promise.all([validData1, validData2]).then(async () => {
        this.form.metricName = this.metricObj.value;
        let selectRole = this._map(this.selectRole, (item) => {
          let obj = JSON.parse(item);
          return {
            objectId: obj.id,
            objectType: 'ROLE',
            objectName: obj.roleName,
            levelType: this.form.levelType
          };
        });
        let checkedNodes = this._map(this.checkedNodes, (item) => {
          return {
            objectId: item.id,
            objectType: item.type,
            objectName: item.label,
            levelType: this.form.levelType
          };
        });
        let selectRole2 = this._map(this.selectRole2, (item) => {
          let obj = JSON.parse(item);
          return {
            objectId: obj.id,
            objectType: 'ROLE',
            objectName: obj.roleName,
            levelType: this.form.levelType
          };
        });
        let checkedNodes2 = this._map(this.checkedNodes2, (item) => {
          return {
            objectId: item.id,
            objectType: item.type,
            objectName: item.label,
            levelType: this.form.levelType
          };
        });
        // let selectEquipment = this._map(this.form.notifyEquipment, (item) => {
        //   let obj = this._find(this.allEquipmentList, { id: item });
        //   return {
        //     objectId: obj.id,
        //     objectType: 'MACHINE',
        //     objectName: obj.name,
        //     levelType: this.form.levelType
        //   };
        // });
        // this.form.notifyObjectList = [...selectRole, ...checkedNodes, ...selectEquipment];
        this.form.notifyObjectList = [...selectRole, ...checkedNodes];
        // this.form.upgradeNotifyObjectList = [...selectRole2, ...checkedNodes2, ...selectEquipment];
        this.form.upgradeNotifyObjectList = [...selectRole2, ...checkedNodes2];
        this.form['notifyMethodList'] = [];
        if (this.form.notifyType) {
          this.form.notifyMethodList.push({ notifyTitle: this.form.notifyTitle, notifyType: this.form.notifyType, notifyContent: this.form.notifyContent });
        }
        if (this.form.isEmailNotification) {
          this.form.notifyMethodList.push({ notifyTitle: this.form.notifyTitle, notifyType: 'EMAIL', notifyContent: this.form.notifyContent });
        }
        this.form['extFields'] = JSON.stringify(this.form.extFields);
        submit(this.form).then(
          (res) => {
            this.showDialog = false;
            this.$message({
              type: 'success',
              message: res.data.msg
            });
            this.onLoad(this.page);
            this.$refs.crud.refreshTable();
          },
          (error) => {
            this.form.extFields = JSON.parse(this.form.extFields);
          }
        );
      });
    },
    rowDel(row, index, done) {
      this.$confirm(`确定将该消息事件${row.strategyName}删除?`, {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          return remove(row.id);
        })
        .then(() => {
          this.$message({
            type: 'success',
            message: '操作成功!'
          });
          // 数据回调进行刷新
          done(row);
        });
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning('请选择至少一条数据');
        return;
      }
      let enbaleStatusList = [];
      let strategyNames = [];
      this._forEach(this.selectionList, (item) => {
        if (item.status != 0) {
          enbaleStatusList.push(item.strategyName);
        } else {
          strategyNames.push(item.strategyName);
        }
      });
      if (enbaleStatusList.length > 0) {
        this.$message.error(`消息事件${enbaleStatusList.join('、')}正在启用中，无法删除！`);
        return;
      }
      this.$confirm(`确定将选择消息事件${strategyNames.join('、')}删除?`, {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          // 刷新表格数据并重载
          this.$refs.crud.refreshTable();
          this.$refs.crud.toggleSelection();
          // 表格数据重载
          this.onLoad(this.page);
          this.$message({
            type: 'success',
            message: '操作成功!'
          });
        });
    },
    handleEnbale(row) {
      this.$confirm(`确定将该消息事件${row.strategyName}启用?`, {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        enable(row.id).then((res) => {
          this.$message.success(res.data.msg);
          this.onLoad(this.page);
        });
      });
    },
    handleDisable(row) {
      this.$confirm(`确定将该消息事件${row.strategyName}禁用?`, {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        disable(row.id).then((res) => {
          this.$message.success(res.data.msg);
          this.onLoad(this.page);
        });
      });
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      if (params.metricId) {
        params.metricId = params.metricId[1];
      }
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        this.loading = false;
        this.selectionClear();
      });
    },
    treeLoad(tree, treeNode, resolve) {
      getChild({ parentId: tree.id }).then((res) => {
        const data = res.data.data;
        if (Array.isArray(data)) {
          data.forEach((item) => {
            if (item.hasChild) {
              item.hasChildren = true;
            }
          });
        }
        resolve(res.data.data || []);
      });
    },
    /**
     * 重新加载公用表格弹窗组件
     */
    newKey() {
      this.timer = new Date().getTime();
    },
    /**
     * 打开编辑模态框
     */
    opendetailRow(row, type) {
      this.showDialog = true;
      this.dialogTitle = type === 'edit' ? '编辑' : '详情';
      this.basicDataOption.detail = type === 'edit' ? false : true;
      this.$nextTick(() => {
        this.$refs.form1.allDisabled = type === 'edit' ? false : true;
        this.$refs.form2.allDisabled = type === 'edit' ? false : true;
      });
      let strategyCode = this.findObject(this.basicDataOption.group[0].column, 'strategyCode');
      strategyCode.disabled = true;
      getDetail(row.id).then((res) => {
        this.form = this._get(res, 'data.data', {});
        this.strategyType = this.form.strategyType;
        this.triggerRuleList = this.form.rules;
        this.detailRuleData = this._map(this.triggerRuleList, (item) => {
          return {
            operator: item.operator,
            threshold: item.maxValue
          };
        });
        this._forEach(this.triggerRuleList, (item) => {
          delete item.id;
        });
        setTimeout(() => {
          let metricId = this.findObject(this.basicDataOption.group[0].column, 'metricId');
          let dicData = metricId.dicData;
          let obj;
          this._forEach(dicData, (item) => {
            if (item.value.includes(this.form.metricId)) {
              obj = item.value;
            }
          });
          this.form.metricId = obj;
        }, 800);
        this.notifyObjectTags = [];
        this.selectRole = [];
        this.defaultChecked = [];
        this.checkedNodes = [];
        this.notifyObjectTags2 = [];
        this.selectRole2 = [];
        this.defaultChecked2 = [];
        this.checkedNodes2 = [];
        if (this.form.extFields && this.form.extFields != null) {
          this.form.extFields = JSON.parse(this.form.extFields);
          console.log(this.form.extFields);
          this.defaultExpandedKey = this.form.extFields.defaultExpandedKey;
          this.defaultExpandedKey2 = this.form.extFields.defaultExpandedKey2;
          console.log(this.defaultExpandedKey);
        } else {
          this.form['extFields'] = {};
        }
        this._forEach(this.form.notifyObjectList, (item) => {
          if (item.objectType === 'ROLE') {
            this.notifyObjectTags.push({ label: item.objectName, id: item.objectId, type: 'role' });
            this.selectRole.push(JSON.stringify({ id: item.objectId, roleName: item.objectName }));
          } else if (item.objectType === 'MACHINE') {
            // this.form['notifyEquipment'] = [];
            // this.form.notifyEquipment.push(item.objectId);
          } else if (item.objectType === 'EMAIL') {
            this.form.isEmailNotification = true;
          } else {
            this.notifyObjectTags.push({ label: item.objectName, id: item.objectId, type: 'dept' });
            this.defaultChecked.push(item.objectId);
            this.checkedNodes.push({
              id: item.objectId,
              type: item.objectType,
              label: item.objectName,
              levelType: item.levelType
            });
          }
        });
        this._forEach(this.form.upgradeNotifyObjectList, (item) => {
          if (item.objectType === 'ROLE') {
            this.notifyObjectTags2.push({ label: item.objectName, id: item.objectId, type: 'role' });
            this.selectRole2.push(JSON.stringify({ id: item.objectId, roleName: item.objectName }));
          } else if (item.objectType === 'MACHINE') {
            // this.form['notifyEquipment'] = [];
            // this.form.notifyEquipment.push(item.objectId);
          } else if (item.objectType === 'EMAIL') {
            this.form.isEmailNotification = true;
          } else {
            this.notifyObjectTags2.push({ label: item.objectName, id: item.objectId, type: 'dept' });
            this.defaultChecked2.push(item.objectId);
            this.checkedNodes2.push({
              id: item.objectId,
              type: item.objectType,
              label: item.objectName,
              levelType: item.levelType
            });
          }
        });
        console.log(this.defaultChecked);
        this._forEach(this.form.notifyMethodList, (item) => {
          this.form.notifyTitle = item.notifyTitle;
          this.form.notifyContent = item.notifyContent;
          if (item.notifyType === 'EMAIL') {
            this.form.isEmailNotification = true;
          } else {
            this.form.notifyType = item.notifyType;
          }
        });
      });
    },
    detailRowDel(row, index, done) {
      if (row.status != 0) {
        this.$message.error('该消息事件正在启用中，无法删除！');
      } else {
        this.$confirm(`确定将该消息事件${row.strategyName}删除?`, {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(() => {
            return remove(row.id);
          })
          .then((res) => {
            this.$refs.crud.refreshTable();
            this.onLoad(this.page);
            this.$message({
              type: 'success',
              message: '操作成功!'
            });
            done();
          });
      }
    },
    selectRoleChange() {
      console.log(this.selectRole);
      this.notifyObjectTags = [];
      this._forEach(this.selectRole, (item) => {
        let object = JSON.parse(item);
        this.notifyObjectTags.push({ label: object.roleName, id: object.id, type: 'role' });
      });
      this._forEach(this.checkedNodes, (item) => {
        this.notifyObjectTags.push({ label: item.label, id: item.id, type: 'dept' });
      });
    },
    selectRoleChange2() {
      this.notifyObjectTags2 = [];
      this._forEach(this.selectRole2, (item) => {
        let object = JSON.parse(item);
        this.notifyObjectTags2.push({ label: object.roleName, id: object.id, type: 'role' });
      });
      this._forEach(this.checkedNodes2, (item) => {
        this.notifyObjectTags2.push({ label: item.label, id: item.id, type: 'dept' });
      });
    },
    tagClose(tag) {
      if (this.dialogTitle != '详情') {
        if (tag.type === 'role') {
          let index = this._indexOf(this.selectRole, JSON.stringify({ id: tag.id, roleName: tag.label }));
          this.selectRole.splice(index, 1);
        } else {
          let index = this._findIndex(this.checkedNodes, { id: tag.id });
          this.checkedNodes.splice(index, 1);
          this.$refs.elTree.setChecked(tag.id, false);
        }
        this.notifyObjectTags.splice(this.notifyObjectTags.indexOf(tag), 1);
      }
    },
    tagClose2(tag) {
      if (this.dialogTitle != '详情') {
        if (tag.type === 'role') {
          let index = this._indexOf(this.selectRole2, JSON.stringify({ id: tag.id, roleName: tag.label }));
          this.selectRole2.splice(index, 1);
        } else {
          let index = this._findIndex(this.checkedNodes2, { id: tag.id });
          this.checkedNodes2.splice(index, 1);
          this.$refs.elTree2.setChecked(tag.id, false);
        }
        this.notifyObjectTags2.splice(this.notifyObjectTags2.indexOf(tag), 1);
      }
    },
    loadNode(node, resolve) {
      if (node.level === 0) {
        getTree().then(
          (res) => {
            let data = this._get(res, 'data.data', []);
            resolve(
              this._map(data, (item) => {
                let isLeaf = true;
                if (item.hasChildren || item.hasUser) {
                  isLeaf = false;
                } else {
                  isLeaf = true;
                }
                return {
                  id: item.id,
                  value: item.id,
                  label: item.title,
                  type: 'DEPT',
                  leaf: isLeaf
                };
              })
            );
          },
          (error) => {
            resolve([]);
          }
        );
      } else {
        getTreeChild(node.data.value).then(
          (res) => {
            let data = this._get(res, 'data.data', []);
            resolve(
              this._map(data, (item) => {
                let isLeaf = true;
                if (item.hasChildren || item.hasUser) {
                  isLeaf = false;
                } else {
                  isLeaf = true;
                }
                return {
                  id: item.id,
                  value: item.id,
                  label: item.title,
                  type: item.type,
                  leaf: isLeaf
                };
              })
            );
          },
          (error) => {
            resolve([]);
          }
        );
      }
    },
    currentCheck(data, node) {
      this.notifyObjectTags = [];
      this._forEach(this.selectRole, (item) => {
        let object = JSON.parse(item);
        this.notifyObjectTags.push({ label: object.roleName, id: object.id, type: 'role' });
      });
      console.log(data, node);
      this.halfCheckedKeys = node.halfCheckedKeys;
      if (this.dialogTitle === '新增') {
        this.form['extFields'] = { defaultExpandedKey: this.halfCheckedKeys, defaultExpandedKey2: this.halfCheckedKeys2 };
      } else if (this.dialogTitle === '编辑') {
        console.log(this.form.extFields);
        this.form.extFields.defaultExpandedKey = this.halfCheckedKeys;
      }
      this.checkedNodes = node.checkedNodes;
      this._forEach(node.checkedNodes, (item) => {
        if (!item.leaf) {
          let node = this.$refs.elTree.getNode(item.id);
          //将选中的未展开的节点进行展开
          if (node.checked && !node.expanded) {
            node.expand(() => {
              for (let i = 0; i < node.childNodes.length; i++) {
                console.log(node.childNodes[i]);
                node.childNodes[i].expand();
                let checkNodes = this.$refs.elTree.getCheckedNodes();
                let halfCheckedKeys = this.$refs.elTree.getHalfCheckedKeys();
                this.currentCheck(node.childNodes[i].data, { checkedNodes: checkNodes, halfCheckedKeys: halfCheckedKeys });
              }
            });
          }
          this.halfCheckedKeys.push(item.id);
        }
        this.notifyObjectTags.push({ label: item.label, id: item.id, type: 'dept' });
      });
    },
    currentCheck2(data, node) {
      this.notifyObjectTags2 = [];
      this._forEach(this.selectRole2, (item) => {
        let object = JSON.parse(item);
        this.notifyObjectTags2.push({ label: object.roleName, id: object.id, type: 'role' });
      });
      console.log(data, node);
      this.halfCheckedKeys2 = node.halfCheckedKeys;
      if (this.dialogTitle === '新增') {
        this.form['extFields'] = { defaultExpandedKey: this.halfCheckedKeys, defaultExpandedKey2: this.halfCheckedKeys2 };
      } else if (this.dialogTitle === '编辑') {
        console.log(this.form.extFields);
        this.form.extFields.defaultExpandedKey2 = this.halfCheckedKeys2;
      }
      this.checkedNodes2 = node.checkedNodes;
      this._forEach(node.checkedNodes, (item) => {
        if (!item.leaf) {
          let node = this.$refs.elTree2.getNode(item.id);
          //将选中的未展开的节点进行展开
          if (node.checked && !node.expanded) {
            node.expand(() => {
              for (let i = 0; i < node.childNodes.length; i++) {
                console.log(node.childNodes[i]);
                node.childNodes[i].expand();
                let checkNodes = this.$refs.elTree2.getCheckedNodes();
                let halfCheckedKeys = this.$refs.elTree2.getHalfCheckedKeys();
                this.currentCheck2(node.childNodes[i].data, { checkedNodes: checkNodes, halfCheckedKeys: halfCheckedKeys });
              }
            });
          }
          this.halfCheckedKeys2.push(item.id);
        }
        this.notifyObjectTags2.push({ label: item.label, id: item.id, type: 'dept' });
      });
    },
    handleCommand(type) {
      if (type === 'dept') {
        this.visibleRole = false;
      } else {
        this.visibleDept = false;
      }
    },
    handleCommand2(type) {
      if (type === 'dept') {
        this.visibleRole2 = false;
      } else {
        this.visibleDept2 = false;
      }
    }
  }
};
</script>

<style lang="scss" scoped>
// .showDialog {
//   ::v-deep .el-dialog__body {
//     padding: 0px 20px;
//   }
// }
.messageStrategyShowDialog {
  ::v-deep .el-dialog__body {
    .avue-crud__menu {
      display: none;
    }
  }
}
.detailForm {
  ::v-deep .el-select {
    width: 92% !important;
  }
  ::v-deep .el-input-number {
    width: 92% !important;
  }
}
.tags {
  border: 1px solid #dcdfe6;
  width: 100%;
  border-radius: 4px;
  .el-tag {
    margin: 0 3px;
  }
}
</style>
